<template>
  <div style="border: 2px solid red">
    这里是一级路由页面
    <!-- 第一种方式，v-bind的对象形式动态绑定data中的值！url="/two/8888" -->
    <input type="text" v-model="userid">
    <router-link :to="{path:'/two/'+userid}">二级路由页面展示使用router配置的path属性</router-link> |
    <!-- 第二种方式，v-bind的对象形式动态绑定data中的值！url="/two/8888"
    uid对应的就是  $route.params.uid 则可以取出userid的值！ -->
    <router-link :to="{name:'Two',params:{userid:userid}}">二级路由页面展示使用router配置的name属性</router-link> |
    <!-- 一级路由显示的页面中，如有路由出口则对应二级路由页面！ -->
    <router-view></router-view>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        userid:1212
      };
    },
  };
</script>

<style>
</style>